<template>
	<view>
		<cu-custom bgColor="bg-rgb" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">新增设备停机</block>
		</cu-custom>
		<form>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 0.1 + 's'}]">
				<view class="title">设备SN：</view>
				<input placeholder="请输入设备SN" name="input" v-model="myFormData.deviceSn"></input>
			</view>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 0.2 + 's'}]">
				<view class="title">设备名称：</view>
				<input placeholder="请输入设备名称" name="input" v-model="myFormData.deviceName"></input>
			</view>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 0.3 + 's'}]">
				<view class="title">设备类型：</view>
				<input placeholder="请输入设备类型" name="input" v-model="myFormData.deviceType"></input>
			</view>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 0.4 + 's'}]">
				<view class="title">停机原因：</view>
				<input placeholder="请输入停机原因" name="input" v-model="myFormData.shutdownReason"></input>
			</view>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 0.5 + 's'}]">
				<view class="title">停机类型：</view>
				<input placeholder="请输入停机类型" name="input" v-model="myFormData.shutdownType"></input>
			</view>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 0.6 + 's'}]">
				<view class="title">开始时间</view>
				<view class="" @click="start">
					{{startString}}
				</view>
			</view>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 0.7 + 's'}]">
				<view class="title">结束时间</view>
				<view class="" @click="end">
					{{endString}}
				</view>
			</view>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 0.8 + 's'}]">
				<view class="title">临时处理方法：</view>
				<input placeholder="请输入临时处理方法" name="input" v-model="myFormData.tempHandleway"></input>
			</view>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 0.9 + 's'}]">
				<view class="title">长期处理方法：</view>
				<input placeholder="请输入长期处理方法" name="input" v-model="myFormData.longtimeHandleway"></input>
			</view>
			<view class="cu-form-group animation-slide-bottom" :style="[{animationDelay: 1.0 + 's'}]">
				<view class="title">备注：</view>
				<input placeholder="请输入备注" name="input" v-model="myFormData.notes"></input>
			</view>
			<view class="padding flex flex-direction animation-slide-bottom" :style="[{animationDelay: 0.9 + 's'}]">
				<button class="cu-btn bg-rgb lg" @click="onSubmit">添加</button>
			</view>
		</form>
		<w-picker :visible.sync="visible" mode="date" startYear="2017" endYear="2229" :value="myFormData.startTime" :current="true"
		 fields="second" @confirm="onConfirm($event,'start')" @cancel="onCancel" :disabled-after="false" ref="date"></w-picker>
		<w-picker :visible.sync="visible1" mode="date" startYear="2017" endYear="2229" :value="myFormData.endTime" :current="true"
		 fields="second" @confirm="onConfirm($event,'end')" @cancel="onCancel" :disabled-after="false" ref="date1"></w-picker>
	</view>
</template>

<script>
	import wPicker from "@/components/w-picker/w-picker.vue";
	export default {
		components: {
			wPicker
		},
		data() {
			return {
				myFormData: {
					deviceSn: '', // 设备SN
					deviceName: '', // 设备名称
					deviceType: '', // 设备类型
					shutdownReason: '', //停机原因
					shutdownType: '', // 停机类型
					tempHandleway: '', // 临时处理方法
					longtimeHandleway: '', // 长期处理方法
					notes: '', // 备注
					startTime: '',
					endTime: ''
				},
				startString: '请选择开始时间',
				endString: '请选择结束时间',
				visible: false,
				visible1: false
			};
		},
		onLoad: function(option) {},
		methods: {
			start() {
				this.$refs.date.show()
			},
			end() {
				this.$refs.date1.show()
			},
			onConfirm(e, date) {
				console.log(e, date)
				if (date == 'start') {
					this.startString = e.value
					this.myFormData.startTime = e.value
				} else {
					this.endString = e.value
					this.myFormData.endTime = e.value
				}
			},
			onCancel() {
			
			},
			onSubmit() {
				uni.showModal({
					title: '添加设备停机',
					content: '确定要添加设备停机吗?',
					cancelText: '取消',
					confirmText: '确定',
					success: res => {
						if (res.confirm) {
							if (this.myFormData.deviceSn.replace(/\s+/g, "") == '') {
								// this.$tip.error('设备SN不能为空');
                this.modal.show({ type:'error', content:'设备SN不能为空' })
								return false
							} else if (this.myFormData.deviceName.replace(/\s+/g, "") == '') {
								// this.$tip.error('设备名称不能为空');
								this.modal.show({ type:'error', content:'设备名称不能为空' })
								return false
							} else if (this.myFormData.deviceType.replace(/\s+/g, "") == '') {
								// this.$tip.error('设备类型不能为空');
								this.modal.show({ type:'error', content:'设备类型不能为空' })
								return false
							} else if (this.myFormData.shutdownReason.replace(/\s+/g, "") == '') {
								// this.$tip.error('停机原因不能为空');
								this.modal.show({ type:'error', content:'停机原因不能为空' })
								return false
							} else if (this.myFormData.shutdownType.replace(/\s+/g, "") == '') {
								// this.$tip.error('停机类型不能为空');
								this.modal.show({ type:'error', content:'停机类型不能为空' })
								return false
							} else if (this.myFormData.tempHandleway.replace(/\s+/g, "") == '') {
								// this.$tip.error('临时处理方法不能为空');
								this.modal.show({ type:'error', content:'临时处理方法不能为空' })
								return false
							} else if (this.myFormData.longtimeHandleway.replace(/\s+/g, "") == '') {
								// this.$tip.error('长期处理方法不能为空');
								this.modal.show({ type:'error', content:'长期处理方法不能为空' })
								return false
							}else if (this.myFormData.notes.replace(/\s+/g, "") == '') {
								// this.$tip.error('备注不能为空');
								this.modal.show({ type:'error', content:'备注不能为空' })
								return false
							}else if (this.myFormData.startTime.replace(/\s+/g, "") == '') {
								// this.$tip.error('开始时间不能为空');
								this.modal.show({ type:'error', content:'开始时间不能为空' })
								return false
							}else if (this.myFormData.endTime.replace(/\s+/g, "") == '') {
								// this.$tip.error('结束时间不能为空');
								this.modal.show({ type:'error', content:'结束时间不能为空' })
								return false
							}
							uni.showLoading({
								mask:true,
								title:'添加中.....'
							})
							let mesTempratureGraph = this.myFormData
							this.$http.post('produce/mesDeviceShutdown/add', mesTempratureGraph).then(res => {
								console.log(res)
								uni.hideLoading()
								if (res.data.success) {
									// this.$tip.success(res.data.message);
									this.modal.show({ type:'success', content:res.data.message })
									setTimeout(function() {
										uni.navigateBack({
											delta: 1
										})
									}, 1000);
								} else {
									// this.$tip.error(res.data.message)
                  this.modal.show({ type:'error', content:res.data.message })
								}
							})
						}
					}
				})
			}
		}
	}
</script>

<style>
	.cu-form-group .title {
		min-width: calc(4em + 15px);
	}

	.btn {
		background-color: rgb(0, 64, 152);
		padding: 10rpx;
		color: white;
		border-radius: 10rpx;
	}

	input {
		text-align: right;
	}
</style>
